Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Button] Reduce space between chevron icon and provided icon when icon-only #11985

Closed

Conversation

chloerice
Copy link
Member

@chloerice chloerice commented May 6, 2024

WHY are these changes introduced?

There's too much spacing between provided icons and the chevron icon rendered in icon-only disclosure buttons. When laid out in a toolbar like the RTE's, the chevrons look like they're separate buttons. The primary use case in admin for icon-only disclosures is the rich text editor, which in /products is using a custom button so they can tighten this gap, but it should be done at the system level.

WHAT is this pull request doing?

This PR tightens the spacing between the Button icon and disclosure SVGs when icon-only.

Before After
Screenshot 2024-05-06 at 5 14 25 PM Screenshot 2024-05-06 at 4 58 08 PM

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

🎩 checklist

@chloerice chloerice force-pushed the reduce-spacing-in-iconOnly-disclosure-Buttons branch 4 times, most recently from 5027e31 to 5c1e608 Compare May 6, 2024 18:55
@chloerice chloerice changed the title [Button] Reduce space between chevron icon and provided for icon when icon-only [Button] Reduce space between chevron icon and provided icon when icon-only May 6, 2024
@chloerice chloerice force-pushed the reduce-spacing-in-iconOnly-disclosure-Buttons branch from 5c1e608 to 5938e77 Compare May 6, 2024 21:13
@Shopify Shopify deleted a comment from github-actions bot May 6, 2024
@chloerice
Copy link
Member Author

/snapit

Copy link
Contributor

github-actions bot commented May 6, 2024

🫰✨ Thanks @chloerice! Your snapshot has been published to npm.

Test the snapshot by updating your package.json with the newly published version:

"@shopify/polaris": "0.0.0-snapshot-20240506211703"

@chloerice chloerice added the #gsd:40315 Admin Quality Improvements (Q2 2024) label May 6, 2024
@jeffkraemer2
Copy link

Needs to be moved into correct repo

@jeffkraemer2
Copy link

@chloerice, there's a note that this needs to be moved into the correct repo. Can you please specify next steps for the new QC developers?

@chloerice chloerice removed the #gsd:40315 Admin Quality Improvements (Q2 2024) label Jul 16, 2024
@chloerice chloerice closed this Jul 16, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants